var slideStreamId;

var slideList = {
        
    currentSlide: null,
    thumbnailLoaderPeriodical: null,
    savePeriodical: null,
    registeredModules: {},
    
    init : function(settings) {
        slideList.config = {
            timelineWrapper      : 'div#timeline',
            $parent              : $('#timelineThumbs'),
            baseUrl              : $('#baseUrl').val(),
            thumbSelector        : 'div.thumbnail',
            thumbnailLoaderTimer : 15, // how often to check to load the thumbnails
            saveTimer            : 30  // it'll run more frequently than this when the user is doing things, but this is just in case.
        };
    
        // allow overriding the default config
        $.extend(slideList.config, settings);
        
        slideList.config.$parent.sortable({
            axis: 'y',
            containment: 'parent',
            tolerance: 'pointer',
            stop: function(event, ui) {
                slideList.updateSlideOrder();
                slideList.save();
            }
        });
        
        // when a user clicks on a slide thumbnail, we'll load all the data
        // associated with that slide into the correct places
        // for any modules, it assumes that the keys are mapped to id's            
        $(slideList.config.thumbSelector, slideList.config.$parent).live('click', function(e) {
            
            var $obj = $(this);
            
            slideList.currentSlide = $obj;
            
            $(slideList.config.thumbSelector).removeClass('selected');
            $obj.addClass('selected');
            
            var slideId = $obj.data('slideId');
            
            if (!$obj.hasClass('loading')) {
                previewPane.setImage(slideId);
            } else {
                previewPane.setImage(false);
            }
            
            previewPane.setTitle($obj.data('title'));
            previewPane.setDisplayLength($obj.data('displayLength'));
            
            // load the type settings for for this type of slide
            controlPanel.loadTypeSettingsForm($obj.data('slideType'));
            
            // load module data for the slide if it exists
            controlPanel.getModules().each(function() {
                
                var module = $(this);
                var moduleName = module.attr('id');
                
                var moduleData = $obj.data(moduleName);
                
                if (moduleData !== undefined && moduleData.length !== 0) {
                    // we assume that there is an element with the same id in the module DOM element to dump the data into
                    $.each(moduleData, function(index, el) {
                        $('#' + index, module).val(el);
                    });
                } else {
                    // if there is no data for the module for this slide, then just empty the fields
                    $(this).find('input[type=text], textarea, input[type=radio], select').val('');
                }
                
                if ($.isFunction(slideList.registeredModules.moduleName.activate)) {
                    slideList.registeredModules.moduleName.activate();
                }
            });
        });
                
        // the periodical starts here, the * 1000 is because milliseconds are required
        slideList.thumbnailLoaderPeriodical = window.setInterval(slideList.loadThumbnailScreenshots, slideList.config.thumbnailLoaderTimer * 1000);
        
        // the periodical starts here, the * 1000 is because milliseconds are required
        slideList.savePeriodical = window.setInterval(slideList.save, slideList.config.saveTimer * 1000);
    },
    
    loadTypeSettingsDataCb: function() {            
        $.each(slideList.currentSlide.data('typeData'), function(index, el) {
            $('#' + index, controlPanel.config.$typeSettings).val(el);
        });
    },
    
    loadSlides: function() {
        
        // get all the entities for the timeline
        $.ajax({
            url: slideList.config.baseUrl + '/slidestream/index/get-entities?slideStreamId=' + slideStreamId,
            type: 'GET',
            dataType: 'json',
            async: false,
            success: function(data, textStatus) {
                $.each(data, function(index, el) {
                    var thumb = slideList.createThumbnailElement(el.data.slideId, el.data.slideType, el.data.title, el.displayLength);
                    
                    thumb.data('typeData', el.typeData);
                    
                    // store the data for the modules into the object
                    $.each(el.moduleData, function(name, data) {
                        thumb.data(name, data);
                    });
                    
                    slideList.addSlideToList(thumb);
                });
            }
        });
        
        slideList.updateSlideOrder();
        //slideList.loadThumbnailScreenshots();
        infoPane.updateTotals();
        
        slideList.config.$parent.find(slideList.config.thumbSelector + ':first').click();
    },
    
    addSlideToList: function(slideObj) {
        slideList.config.$parent.prepend(slideObj);
    },
    
    /**
     * Creates a thumbnail element.  All the data for the slide is stored with
     * this object
     * 
     * @param slideId The slideId of the slide
     * @param slideType The type of the slide
     * @param title The title of the slide
     * @param url The url that the slide points to
     * @param displayLength The number of seconds to display the slide
     * @return The thumbnail object
     */
    createThumbnailElement: function(slideId, slideType, title, displayLength) {
        
        var newThumb = $('<div></div>').addClass('thumbnail').addClass('loading');
        newThumb.append($('<div></div>').addClass('displayLength').text(UTIL.formatTime(displayLength, true)));
        newThumb.append($('<div></div>').addClass('title').text(title));
        
        newThumb.data('slideId', slideId);
        newThumb.data('slideType', slideType);
        newThumb.data('title', title);
        newThumb.data('displayLength', displayLength);
        newThumb.data('typeData', {});
        
        return newThumb;
    },
    
    updateSlideOrder: function() {
        var tmpOrder = 1;
        $(slideList.config.thumbSelector, slideList.config.$parent).each(function() {
            $(this).data('order', tmpOrder++);
        });
    },
    
    /**
     * Saves the slidestream.  It will just return if it's already in progress.  Creates
     * a JSON string representing the data structure with all it's attributes and any
     * module info associated with it to send to the backend.
     */
    save: function() {
        
        if (infoPane.isSaveDisabled() === true) {
            return;
        }
        
        infoPane.disableSave();
                
        var slideListArray = [];

        var i = 0;
        $(slideList.config.thumbSelector, slideList.config.$parent).each(function() {
            
            var $obj = $(this);
                        
            slideListArray[i] = {
                slideId       : $obj.data('slideId'),
                slideType     : $obj.data('slideType'),
                order         : $obj.data('order'),
                title         : $obj.data('title'),
                displayLength : $obj.data('displayLength'),
                moduleData    : slideList.getAllModuleData($obj),
                typeData      : slideList.getTypeData($obj)
            };
            
            i++;
        });
        
        var structureStr = $.toJSON(slideListArray);
        
        $.post(
                slideList.config.baseUrl + '/slidestream/index/save-slide-stream',
                {
                    slideStreamId: slideStreamId,
                    data:          structureStr
                },
                function(data, textStatus) {
                    if (data.rc == 1) {
                        
                    } else {
                        alert(data.msg);
                    }
                    
                    infoPane.enableSave();
                },
                'json'
              );
    },
    
    registerModule: function(moduleName, module) {
        slideList.registeredModules.moduleName = module;
    },
    
    getAllModuleData: function($obj) {
        
        var moduleData = {};
        
        controlPanel.getModules().each(function() {
            
            var moduleName = $(this).attr('id');
            
            if ($obj.data(moduleName) !== undefined) {
                moduleData[moduleName] = $obj.data(moduleName);
            }
        });
        
        return moduleData;
    },
    
    getTypeData: function($obj) {
        
        return $obj.data('typeData');
    },
    
    setTypeData: function(id, value) {
        var tmp = slideList.currentSlide.data('typeData');
        tmp[id] = value;
        slideList.currentSlide.data('typeData', tmp);
    },
    
    getCurrentSlide: function() {
        return slideList.currentSlide;
    },
    
    getCurrentSlideId: function() {
        
        if (slideList.currentSlide === null) {
            return null;
        }
        
        return slideList.currentSlide.data('slideId');
    },
    
    getCurrentSlideType: function() {
        if (slideList.currentSlide === null) {
            return null;
        }
        
        return slideList.currentSlide.data('slideType');
    },
    
    getCurrentSlideTitle: function() {
        
        if (slideList.currentSlide === null) {
            return null;
        }
        
        return slideList.currentSlide.data('title');
    },
    
    getCurrentSlideDisplayLength: function() {
        
        if (slideList.currentSlide === null) {
            return null;
        }
        
        return slideList.currentSlide.data('displayLength');
    },
    
    setCurrentSlideTitle: function(title) {
        slideList.currentSlide.data('title', title);
        slideList.currentSlide.find('div.title').text(title);
    },
    
    setCurrentSlideDisplayLength: function(displayLength) {
        slideList.currentSlide.data('displayLength', displayLength);
        slideList.currentSlide.find('div.displayLength').text(UTIL.formatTime(displayLength, true));
    },
    
    getTotalRunningTime: function() {
        var totalRunningTimeValue = 0;
        $(slideList.config.thumbSelector, slideList.config.$parent).each(function() {
            totalRunningTimeValue += parseInt($(this).data('displayLength'), 10);
        });
        
        return totalRunningTimeValue;
    },
    
    getSlideCount: function() {
        return $(slideList.config.thumbSelector, slideList.config.$parent).length;
    },
    
    setModuleData: function(moduleName, moduleData) {
        slideList.currentSlide.data(moduleName, moduleData);
    },
    
    getModuleData: function(moduleName) {
        return slideList.currentSlide.data(moduleName);
    },
    
    /**
     * Loads the thumbnail images
     */
    loadThumbnailScreenshots: function() {
        
        $('div.loading', slideList.config.$parent).each(function() {
                        
            var $obj = $(this);
            
            if ($obj.data('numScreenshotTries') === undefined) {
                $obj.data('numScreenshotTries', 10);
            }
            
            if ($obj.data('numScreenshotTries') === 0) {
                $obj.removeClass('loading');
                $obj.removeData('numScreenshotTries');
                return;
            }
            
            $obj.css('backgroundImage', 'url(' + slideList.config.baseUrl + '/public/images/slideThumbDefault.png');
            
            var slideId = $obj.data('slideId');
            var imagePath = baseUrl + '/public/screenshots/' + slideId + '/thumbnail.jpg';
            
            $.getJSON(slideList.config.baseUrl + '/slidestream/index/screenshots-exist?slideId=' + slideId, function(data, textStatus) {
                
                if (data.result == "1") {
                    $obj.css('backgroundImage', 'url(' + imagePath + ')');
                    
                    if (slideId == slideList.getCurrentSlideId()) {
                        previewPane.setImage(slideId);
                    }
                    
                    $obj.removeClass('loading');
                    $obj.removeData('numScreenshotTries');
                    
                } else {
                    // make the request to generate the screenshots
                    $.ajax({
                        type: 'GET',
                        url: slideList.config.baseUrl + '/slidestream/index/generate-screenshots',
                        data: 'slideId=' + slideId,
                        async: true,
                        beforeSend: function(XMLHttpRequest) {
                            if ($obj.data('running') === true) {
                                return false;
                            } else {
                                $obj.data('running', true);
                            }
                        },
                        complete: function(XMLHttpRequest, textStatus) {
                            $obj.removeData('running');
                            $obj.data('numScreenshotTries', parseInt($obj.data('numScreenshotTries'), 10) - 1);
                        }
                    });
                }
            });
        });
    },
    
    deleteCurrent: function() {
        var next = slideList.currentSlide.next();
        var prev = slideList.currentSlide.prev();
                
        $.post(
            slideList.config.baseUrl + '/slidestream/index/delete-slide',
            {
                slideStreamId: slideStreamId,
                slideId: slideList.currentSlide.data('slideId')
            },
            function(data, textStatus) {
                if (data.rc == 1) {
                    
                    slideList.currentSlide.remove();
                    if (next.length !== 0) {
                        next.click();
                    } else if (prev.length !== 0) {
                        prev.click();
                    } else {
                        // don't try to select another slide
                    }
                    
                    slideList.updateSlideOrder();
                    infoPane.updateTotals();
                    slideList.save();
                    
                } else {
                    alert('Error deleting slide.  Please try again');
                }
            },
            'json'
        );
    }
};

var infoPane = {
        
    $totalSlides : null,
    $totalRunningTime : null,
    $saveSlideStreamButton : null,
    $addSlideButton : null,
    $dialog : null,
    $slideStreamTitle : null,
        
    init: function(settings) {
        infoPane.config = { 
            baseUrl : $('#baseUrl').val()
        };
        
        infoPane.$totalSlides           = $('#totalSlides');
        infoPane.$totalRunningTime      = $('#totalRunningTime');
        infoPane.$saveSlideStreamButton = $('#saveSlideStreamButton');
        infoPane.$addSlideButton        = $('#addSlideButton');
        infoPane.$dialog                = $('#addSlideDialog');
        infoPane.$slideStreamTitle      = $('span#slideStreamTitle');
        
        infoPane.$saveSlideStreamButton.click(function(e) {
            slideList.save();
        });
                
        infoPane.initAddDialog();
        
        infoPane.$addSlideButton.click(function() {
            infoPane.$dialog.dialog('open');
        });
        
        infoPane.$slideStreamTitle.hover(
            function(){ $(this).addClass('ui-state-highlight'); }, 
            function(){ $(this).removeClass('ui-state-highlight'); }
            
        ).click(function() {
            var newSlideStreamTitle = prompt('Enter the new slide stream title:', $(this).text());
            
            if ($.trim(newSlideStreamTitle) != "") {
                        
                $(this).text(newSlideStreamTitle);
                $.post(infoPane.config.baseUrl + '/slidestream/index/save-slide-stream-info',
                   {
                      slideStreamId: slideStreamId,
                      title        : newSlideStreamTitle
                   },
                   function(data, textStatus) {
                   },
                   'json');
            }
        });
    },
    
    isSaveDisabled: function() {
        return infoPane.$saveSlideStreamButton.attr('disabled');
    },
    
    disableSave: function() {
        infoPane.$saveSlideStreamButton.attr('disabled', true)
                                         .addClass('ui-state-disabled')
                                       .val('Saving...');
    },
    
    enableSave: function() {
        infoPane.$saveSlideStreamButton.attr('disabled', false)
                                        .removeClass('ui-state-disabled')
                                       .val('Save Slide Stream');
    },
    
    updateTotals: function() {
        
        var totalRunningTimeValue = slideList.getTotalRunningTime();
        var totalSlidesValue = slideList.getSlideCount();
            
        infoPane.$totalRunningTime.text(UTIL.formatTime(totalRunningTimeValue));
        infoPane.$totalSlides.text(totalSlidesValue + " Slide" + ((totalSlidesValue != 1) ? "s" : ""));
        
        if (totalSlidesValue === 0) {
            infoPane.$addSlideButton.click();
            //previewPane.hide();
            //controlPanel.hide();
        } else {
            //previewPane.show();
            //controlPanel.show();
        }
    },
    
    initAddDialog: function() {
        
        infoPane.$dialog.dialog({
            bgiframe: true,
            height: 500,
            width: 850,
            modal: true,
            autoOpen: false,
            overlay: { 
                opacity: 0.5, 
                background: "black" 
            }, 
            buttons: {  
                "Cancel": function() { 
                    $(this).dialog("close"); 
                }
            },
            title: 'Add New Slide'
        });
        
        $('a', infoPane.$dialog).click(function(e) {
            e.preventDefault();
            
            var slideType = $(this).text();
            
            $.post(infoPane.config.baseUrl + '/slide/index/add',
                   {
                       slideStreamId : slideStreamId,
                       slideType     : slideType    
                   },
                   function(data, textStatus) {
                       
                       if (data.rc === 0) {
                           alert(data.msg);
                           return;
                       } else {
                       
                           infoPane.$dialog.dialog('close');
                           
                           var newThumb = slideList.createThumbnailElement(data.slideId, data.slideType, 'New Slide', 5);
                           slideList.addSlideToList(newThumb);
                              
                           newThumb.click();
                               
                              infoPane.updateTotals();
                              slideList.updateSlideOrder();
                              slideList.save();
                              slideList.loadThumbnailScreenshots();
                       }
                   },
                   'json');
            
        });
    }
};

var controlPanel = {
    
    keyUpSaveTimer: null,
        
    init : function(settings) {
    
        controlPanel.config = {
            baseUrl              : $('#baseUrl').val(),
            $content             : $('#controlPanel'),
            $typeSettings        : $('#typeSettings'),
            typeSettingsSelector : '#typeSettings',
            slideTypeSettingsUrl : '/slidestream/index/get-slide-settings-form',
            keyUpSaveDelay       : 1500 //save after 1500 ms of not typing in one of the settings input boxes
        };
        
        $.extend(controlPanel.config, settings);
        
        // watch for changes in form elements boxes and then save the type data to the 
        // current slide and then save the slidestream
        $(controlPanel.config.typeSettingsSelector + ' input, ' + controlPanel.config.typeSettingsSelector + ' select').live('change', function() {
            slideList.setTypeData($(this).attr('id'), $(this).val());
            slideList.save();
        });
        
        // watch for changes in text boxes so we can save the new data and then save the slidestream.
        // we'll have a shortcut timeout so that it doesn't save every single keystroke, just when
        // the user has stopped typing for controlPanel.config.keyUpSaveDelay milliseconds
        $(controlPanel.config.typeSettingsSelector + ' input[type=text]').live('keyup', function() {
                
            clearTimeout(controlPanel.keyUpSaveTimer);
            var box = $(this);
            
            controlPanel.keyUpSaveTimer = setTimeout(function() {
                
                box.change();
                 
                clearTimeout(controlPanel.keyUpSaveTimer);
            }, controlPanel.config.keyUpSaveDelay);
        });
        
        controlPanel.config.$content.accordion({});
    },
    
    getModules: function() {
        return $('div.module', controlPanel.config.$content);
    },
    
    loadTypeSettingsForm: function(type) {
        controlPanel.config.$typeSettings.load(
                                                controlPanel.config.baseUrl + controlPanel.config.slideTypeSettingsUrl + '?type=' + slideList.getCurrentSlideType(),
                                                slideList.loadTypeSettingsDataCb
                                              );
    },
    
    show: function() {
        controlPanel.config.$content.css('visibility', 'visible');
    },
    
    hide: function() {
        controlPanel.config.$content.css('visibility', 'hidden');
    }

};

var previewPane = {
    
    $image             : null,
    $content           : null,
    $title             : null,
    $previewLink       : null,
    $displayLength     : null,
    $minutesSlider     : null,
    $secondsSlider     : null,
    $deleteSlideButton : null,
    $dialog            : null,
        
    init : function(settings) {
    
        previewPane.config = {
            baseUrl : $('#baseUrl').val()
        };
        
        previewPane.$image             = $('#previewImage');
        previewPane.$content           = $('#previewPaneContent');
        previewPane.$title             = $('span#previewInfoTitle');
        previewPane.$displayLength     = $('#displayLength');
        previewPane.$minutesSlider     = $('#displayMinutesSlider');
        previewPane.$secondsSlider     = $('#displaySecondsSlider');
        previewPane.$deleteSlideButton = $('#deleteSlideButton');

        // allow overriding the default config
        $.extend(previewPane.config, settings);
        
        $(previewPane.$title).hover(
            function(){ $(this).addClass('ui-state-highlight'); }, 
            function(){ $(this).removeClass('ui-state-highlight'); }
        );
        
        previewPane.$deleteSlideButton.click(function(e) {
            slideList.deleteCurrent();
        });
        
        previewPane.$title.click(function() {
            var newTitle = prompt('Enter the new title:', slideList.getCurrentSlideTitle());
            if ($.trim(newTitle) != "") {
                slideList.setCurrentSlideTitle(newTitle);
                previewPane.setTitle(newTitle);
                slideList.save();
            }
        });
        
        // setup display length sliders
        previewPane.$minutesSlider.slider({
            range: 'min',
            min: 0,
            max: 59,
            slide: function(event, ui) {
                var seconds = parseInt(previewPane.$secondsSlider.slider('value'), 10);
                var minutes = ui.value;
                previewPane.$displayLength.text(UTIL.formatTime(parseInt((minutes * 60) + seconds, 10)));
            },
            stop: function(event, ui) {
                var seconds = parseInt(previewPane.$secondsSlider.slider('value'), 10);
                var minutes = ui.value;
                slideList.setCurrentSlideDisplayLength((minutes * 60) + seconds);
                infoPane.updateTotals();
                slideList.save();
            }
        });    
    
        previewPane.$secondsSlider.slider({
            range: "min",
            min: 0,
            max: 59,
            slide: function(event, ui) {
                var minutes = parseInt(previewPane.$minutesSlider.slider('value'), 10);
                var seconds = parseInt(ui.value, 10);
                previewPane.$displayLength.text(UTIL.formatTime(parseInt((minutes * 60) + seconds, 10)));
            },
            stop: function(event, ui) {
                var minutes = parseInt(previewPane.$minutesSlider.slider('value'), 10);
                var seconds = parseInt(ui.value, 10);
                slideList.setCurrentSlideDisplayLength((minutes * 60) + seconds);
                infoPane.updateTotals();
                slideList.save();
            }
        });
    },
    
    setImage: function(slideId) {
        if (slideId === false) {
            previewPane.$image.css('backgroundImage', 'url(' + previewPane.config.baseUrl + '/public/images/slidePreviewDefault.png');
        } else {
            previewPane.$image.css('backgroundImage', 'url(' + previewPane.config.baseUrl + '/public/screenshots/' + slideId + '/preview.jpg)');
        }
    },
    
    setTitle: function(title) {
        if (title.length > 50) {
            title = title.substring(0, 50) + '...';
        }
        previewPane.$title.text(title);
    },
    
    setDisplayLength: function(displayLength) {
        
        var minutes = parseInt(parseInt(displayLength, 10) / 60, 10);
        var seconds = parseInt(displayLength, 10) % 60;
        
        previewPane.$minutesSlider.slider('value', minutes);
        previewPane.$secondsSlider.slider('value', seconds);
        previewPane.$displayLength.text(UTIL.formatTime(displayLength));
    },
    
    hide: function() {
        previewPane.$content.css('visibility', 'hidden');
    },
    
    show: function() {
        previewPane.$content.css('visibility', 'visible');
    }
};

$(document).ready(function() {

    slideStreamId = $('#slideStreamId').val();
    
    slideList.init();
    previewPane.init();
    infoPane.init();
    controlPanel.init();
    
    /**
     * Initialize the modules we want to use
     */
    scheduleModule.init();
    transitionModule.init();
    
    slideList.loadSlides(); // load the slides after the interface has been setup
});


/**
 * Various utilities that are used by multiple objects
 */
var UTIL = {
        
        /**
         * Adds the hover classes and round corners to newly created buttons
         */
        themeButtons: function(scope) {

            scope = $(scope);
            $('input[type=submit], input[type=button], input[type=reset], button', scope).addClass('ui-state-default ui-corner-all');
            $('a.ui-state-default, input.ui-state-default, button.ui-state-default', scope).hover(
                function(){ $(this).addClass('ui-state-hover'); }, 
                function(){ $(this).removeClass('ui-state-hover'); }
              );
        },

        /**
         * Returns a string like "1 minute 40 seconds" given a number of seconds, or
         * if the short param is set to true it will return a shortened version like
         * "1m40s"
         * 
         * @param int|string seconds The number of seconds to format
         * @param bool If true returns format like 1m2s
         */
        formatTime: function(seconds, short) {
            
            short = short || false;
            
            seconds = parseInt(seconds, 10);
            
            var mins = parseInt(seconds / 60, 10);
            var secs = parseInt(seconds % 60, 10);
            
            var minsUnit = ' mins ';
            var secsUnit = ' secs';
            
            if (mins == 1) {
                minsUnit = ' min ';
            }
            
            if (secs == 1) {
                secsUnit = ' sec';
            }
            
            if (short === true) {
                minsUnit = 'm';
                secsUnit = 's';
            }
            
            return mins + minsUnit + secs + secsUnit;
        } 
};


/**
 * Sets up the all the interaction for the schedule module
 * 
 * All interaction with the module will operate on the data for the currentSlide
 */
var scheduleModule = {

    init : function(settings) {
    
        scheduleModule.config = {
            baseUrl      : $('#baseUrl').val(),
            moduleName   : 'Schedule',
            fromDate     : 'input#fromDate',
            toDate       : 'input#toDate',
            fromHour     : 'select#fromHour',
            fromMinute   : 'select#fromMinute',
            fromMeridian : 'select#fromMeridian',
            toHour       : 'select#toHour',
            toMinute     : 'select#toMinute',
            toMeridian   : 'select#toMeridian'
        };
        
        $.extend(scheduleModule.config, settings);
        
        $(scheduleModule.config.fromDate + ', ' + scheduleModule.config.toDate).datepicker({
            onClose: function(dateText, inst) {
                scheduleModule.updateTimes();
            }
        });
        
        $(scheduleModule.config.fromHour     + ', ' + 
          scheduleModule.config.fromMinute   + ', ' + 
          scheduleModule.config.fromMeridian + ', ' + 
          scheduleModule.config.toHour       + ', ' + 
          scheduleModule.config.toMinute     + ', ' +
          scheduleModule.config.toMeridian).change(function() {
            scheduleModule.updateTimes();
        });
        
        slideList.registerModule(scheduleModule.config.moduleName, scheduleModule);
    },
    
    updateTimes : function() {
        
        var moduleData = {
                fromDate     : $(scheduleModule.config.fromDate).val(),
                toDate       : $(scheduleModule.config.toDate).val(),
                fromHour     : $(scheduleModule.config.fromHour).val(),
                fromMinute   : $(scheduleModule.config.fromMinute).val(),
                fromMeridian : $(scheduleModule.config.fromMeridian).val(),
                toHour       : $(scheduleModule.config.toHour).val(),
                toMinute     : $(scheduleModule.config.toMinute).val(),
                toMeridian   : $(scheduleModule.config.toMeridian).val()
        };
        
        slideList.setModuleData(scheduleModule.config.moduleName, moduleData);
        slideList.save();
    }
};


/**
 * Sets up the all the interaction for the transition module
 * 
 * All interaction with the module will operate on the data for the currentSlide
 */
var transitionModule = {

    $sampleSlideshow: null,
        
    init : function(settings) {

        transitionModule.config = {
            baseUrl          : $('#baseUrl').val(),
            moduleName       : 'Transition',
            transitionSelect : 'select#transition'
        };
        
        $.extend(transitionModule.config, settings);
        
        $(transitionModule.config.transitionSelect).change(function() {
            transitionModule.updateData();
            transitionModule.startSampleSlideshow($(this).val());
        });
        
        transitionModule.$sampleSlideshow = $('<div id="sampleSlideshow"></div>');
        
        transitionModule.startSampleSlideshow();
        
        slideList.registerModule(transitionModule.config.moduleName, transitionModule);
    },
    
    startSampleSlideshow: function(effect) {
        
        transitionModule.$sampleSlideshow.empty();
        
        for (var i=1; i <= 2; i++) {
            var tmp = $('<div></div>').addClass('image' + i);
            
            $(transitionModule.$sampleSlideshow).append(tmp);
        }
        
        $(transitionModule.config.transitionSelect).closest('div.module').append(transitionModule.$sampleSlideshow);
        
        effect = effect || 'none';
        
        $(transitionModule.$sampleSlideshow).cycle({
                fx: effect,
                timeout: 2000
        });
    },
    
    activate: function() {
        var t = $(transitionModule.config.transitionSelect).val();
        transitionModule.startSampleSlideshow(t);
    },
    
    updateData: function() {
        
        var moduleData = {
            transition : $(transitionModule.config.transitionSelect).val()
        };
        
        slideList.setModuleData(transitionModule.config.moduleName, moduleData);
        slideList.save();
    }
};